<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:xsd ="http://www.w3.org/2001/XMLSchema#"
  xmlns:dcterms="http://purl.org/dc/terms/"
  xmlns:foaf="http://xmlns.com/foaf/0.1/"  
  xmlns:vcard="http://www.w3.org/2006/vcard/ns#"
  xmlns:owl="http://www.w3.org/2002/07/owl#"
  xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#"
  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  xmlns:pb="http://ld2sd.deri.org/pb/ns#"
>
<head>
	<title>RDForms Generator</title>
	<link type="text/css" href="rdformsgenerator.css" rel="stylesheet" />
	<script type="text/javascript" src="jquery-1.3.2.js"></script>
	<script type="text/javascript" src="ui.core.js"></script>
	<script type="text/javascript" src="php.js"></script>
	<script type="text/javascript" src="rdf-parser.js"></script>
	<script type="text/javascript" src="RDFORMS_DEF.js"></script>
	<script type="text/javascript" src="fusion.js"></script>
	<script type="text/javascript">
		var instanceDefaultURI = "http://linkeddata.uriburner.com/sparql?default-graph-uri=http://twitter.com/pushback_demo&query=DESCRIBE%20%3Chttp://twitter.com/pushback_demo%3E&output=rdf";
		var rdfdoc = new RDF();	
		var genBaseUIR = "http://localhost:8888/pushback/fusion/";
			
		$(document).ready(function() {	
			rdfinstanceURI = $("#rdfinstanceURI").val(instanceDefaultURI);
			$("#generateRDForms").click(function() {
				showStatus("Starting fusion ... ");
				startFusion(true);
			});	
			// menu actions
			$("#viewinstancedata").click(function() {
				showStatus("Performing preview ... ");
				viewInstanceData();
				$("#dumpwindow").fadeIn("slow");
			});
			$("#mapinstancedata").click(function() {
				showStatus("Performing mapping ... ");
				mapInstanceData(true);//show dump
			});
			$("#dumpwindowclose").click(function() {
				showStatus(">");
				$("#dumpwindow").fadeOut("slow");
			});
			$("#showTC").click(function() {
				$("#testcases").fadeIn("slow");
			});
			$("#closeTC").click(function() {
				$("#testcases").fadeOut("slow");
			});
			$("#selectTC").change(function() {
				var TC = genBaseUIR + "testcases/" + $("#selectTC option:selected").val();
				$("#inputHTMLfieldURI").val(TC+".html");
				$("#mappingdocURI").val(TC+".sparql");
				loadHTMLForm();
				loadMapping();
			});
			// HTML form actions
			$("#loadHTMLform").click(function() {
				showStatus("Loading HTML form ... ");
				loadHTMLForm();
			});
			$("#htmlview").click(function() {
				showStatus("HTML View active");
				$("#preview").html($("#inputHTMLForm").val());
				$("#previewwindow").fadeIn("slow");
			});
			// RDForms actions
			$("#rdformhtmlview").click(function() {
				showStatus("HTML View active");
				$("#preview").html($("#rdform").val());
				$("#previewwindow").fadeIn("slow");
			});
			$("#previewwindowclose").click(function() {
				showStatus(">");
				$("#previewwindow").fadeOut("slow");
			});
			// hover effect for buttons
			$(".btn").hover(function () {
				$(this).addClass("btnHighlight");
				$(this).removeClass("btn");
			}, function () {
				$(this).addClass("btn");
				$(this).removeClass("btnHighlight");
			});
		});
	</script>
</head>
<body>
	<div>
		<a href="http://esw.w3.org/topic/PushBackDataToLegacySourcesRDForms"><img src="img/pb-logo.png" alt="pushback logo" border="0px" /></a>
		<h1>RDForms Generator</h1>
	</div>
	<div id="menu">
		<div class="menuitem"><span id="generateRDForms" class="btn">Generate RDForm</span></div>
		<div class="menuitem"><span id="showTC" class="btn">Show test cases ...</span></div>
		<div class="menuitem"><input type="checkbox" id="debug" /> Show debug messages</div>
		<div class="menuitem"><a href="" class="btn">reset</a></div>	
	</div>
	<div id="testcases">
		<span id="closeTC" class="btn">x</span>
		<select id="selectTC">
			<option>choose a test case here</option>
			<option value="input-text">&lt;input type='text' ... /&gt;</option>
			<option value="radio">&lt;input type='radio' ... /&gt;</option>
			<option value="textarea">&lt;textarea ... /&gt;</option>
		</select>
	</div>
	

	<form id="generatorForm" action="">
		
		<fieldset>
			<legend>Fusion</legend>
				<div class="leftnext">
					<fieldset id="htmlformtemplatefield">
						<legend>HTML Form Template</legend>
						<textarea cols="60" rows="10" id="inputHTMLForm">&lt;form action="http://twitter.com/status/update" id="doingForm" method="post"&gt;
&lt;fieldset class="common-form standard-form"&gt;
&lt;div class="bar"&gt;
 &lt;h3&gt;&lt;label for="status" class="doing"&gt;What are you doing?&lt;/label&gt;&lt;/h3&gt;
&lt;/div&gt;
&lt;div class="info"&gt;
 &lt;textarea cols="40" rows="2" id="status" name="status" accesskey="u"&gt;&lt;/textarea&gt;
 &lt;div class="status-btn"&gt;
  &lt;input type="submit" name="update" value="update" id="update-submit" class="status-btn round-btn"/&gt;
 &lt;/div&gt;
&lt;/div&gt;
&lt;/fieldset&gt;
&lt;/form&gt;
						</textarea>
						<div id="inputHTMLfield">
							HTML Form URI: <input id="inputHTMLfieldURI" type="text" size="30" value="http://localhost:8888/pushback/fusion/testcases/input-text.html" /> <span id="loadHTMLform" class="btn">Load</span> <span id="htmlview" class="btn">Preview</span>
						</div>
					</fieldset>
					<fieldset id="mappingfield">
						<legend>Mapping</legend>
						<textarea cols="60" rows="15" id="mapping">
PREFIX pb:    &lt;http://rdfs.org/ns/rdforms#&gt; 
PREFIX sioc: &lt;http://rdfs.org/sioc/ns#&gt;
PREFIX rdf: &lt;http://www.w3.org/1999/02/22-rdf-syntax-ns#&gt;
PREFIX : &lt;http://localhost:8888/pushback/rdforms/test.html#&gt;

CONSTRUCT { 
:doingForm a pb:RDForm ;
          pb:field :status ;
          pb:operation :addPost .
:status rdf:type pb:UpdateableField ;
       pb:key  :status.key;
       pb:value :status.val .
:status.val a pb:FieldValue ;
          rdf:value ?status .
:addPost a pb:CRUDOperationCREATE .
}
WHERE {
&lt;http://twitter.com/pushback_demo&gt; sioc:container_of ?status .
FILTER regex(str(?status), "1288526803", "i") 
}</textarea>
						<div id="rdfinstanceURIfield">
							Mapping Document URI: <input id="mappingdocURI" type="text" size="30" value="" /> <span id="mapinstancedata" class="btn">Map</span><br />
							Instance Data URI: <input id="rdfinstanceURI" type="text" size="30" value="" /> <span id="viewinstancedata" class="btn">View</span> 
						</div>	
					</fieldset> 
				</div>
				<fieldset>
					<legend>RDForm</legend>
					<textarea cols="90" rows="30" id="rdform"></textarea>
					<span id="rdformhtmlview" class="btn">Preview</span>
					<div id="baseURIfield">
						Base URI: <input id="baseURI" type="text" size="60" value="http://localhost:8888/pushback/rdforms/test.html#" />
					</div>
				</fieldset>
		</fieldset>
		<fieldset>
			<legend>Options</legend>
			<div>
			Authentication method:<br />
			Deployment base URI:
			</div>
		</fieldset>
	</form>	
	<div id="pbfusion-status">&gt;</div>
	<div id="previewwindow">
		<h3  id="previewwindowclose" class="btn">Preview</h3>
		<div id="preview">
			...
		</div>
	</div>
	<div id="dumpwindow">
		<h3  id="dumpwindowclose" class="btn">Dump</h3>
		<div id="dump">
			...
		</div>
	</div>		
</body>
</html>
